<template>
  <input
    type="text"
    :value="un"
    @input="emit('update:un', $event.target.value)"
  />
  <br />
  <input
    type="text"
    :value="pw"
    @input="emit('update:pw', $event.target.value)"
  />
</template>

<script setup lang="ts">
defineProps(["un", "pw"]);
const emit = defineEmits(["update:un", "update:pw"]);
</script>

<style scoped>
input {
  border: 2px solid black;
  background-image: linear-gradient(45deg, red, yellow, green);
  height: 30px;
  font-size: 20px;
  color: white;
}
</style>
